import React, { useState, useEffect } from 'react';
import * as echarts from 'echarts';

import {
  fetchsync_util,
  addkey_for_mxdata,
  convertISODateTimeToYYYYMMDDHHMMSS,
  view_item_util,
  openNotification_util,
  convertISODateTimeToYYYYMMDDHHMMSS_notutc,
} from '../util/util.js'
import moment from 'moment'
import 'moment/locale/zh-cn'
import { use_bqxj_jjh_initcolmun, use_bj_initcolmun } from './use_zbzx_config.js';
moment.locale('zh-cn')
var storage = window.localStorage;
import useStore from '../../useStore.js'
import CountdownFlipCard from './countdownFlipCard.js';
import Custom_table_hooks_config from '../newmes/custom_table_hooks_config.js';
import { Button, Input, InputNumber, Modal, Popconfirm, Tabs, Tag, Timeline, Badge } from 'antd';
import Upload_fj_hooks from '../newmes/upload_fj_hooks.js';
const { CheckableTag } = Tag;
import { useLatest } from 'ahooks';

const Gysbqxj_form = () => {
  //动态数据源
  const [dynDatasObject, setdynDatasObject] = useState({
  })
  const [isloading, setisloading] = useState(true)
  const [wlmxdata, setwlmxdata] = useState([])
  const [bjmxdata, setbjmxdata] = useState([])
  const [wlmxcolums, setwlmxcolums] = useState(use_bqxj_jjh_initcolmun)
  const [bjcolums, setbjcolums] = useState(use_bj_initcolmun)
  const [bjjg, setBjjg] = useState(0)
  const [bjfj, setBjfj] = useState("")
  const [formdata, setformdata] = useState({})
  const [wldata, setWldata] = useState() //当前报价的物料数据
  const formdataRef = useLatest(formdata)
  const [djs, setDjs] = useState(0) //倒计时
  const [modalOpen, setModalOpen] = useState(false)
  const [bjlc, setBjlc] = useState(1) //当前报价轮次
  const [initStatus, setInitStatus] = useState(false) //初始化状态  
  const initStatusRef = useLatest(initStatus)
  const bjmxdataRef = useLatest(bjmxdata)
  const wldataRef = useLatest(wldata)
  /**
   * 强制刷新明细表 用于特殊场景
   */
  const [switche, setswitche] = useState(true);
  const forceupdate = () => { setswitche(false) }
  useEffect(() => { switche ? "1" : setswitche(true) }, [switche])

  const init = async () => {
    setisloading(true)
    setdynDatasObject({ ...dynDatasObject })
    setisloading(false)
  }

  const { setnowroute, collapsed } = useStore();
  //加载主表数据
  const loadformdata = async (id) => {
    let rtdata = await fetchsync_util("/admin/zbzx/query_gysbqxj_byid", 'POST', { id }, "json")
    let newformdata = rtdata.resultdata.formdata
    newformdata.dqlkssj = newformdata.dqlkssj ? convertISODateTimeToYYYYMMDDHHMMSS(newformdata.dqlkssj) : ""
    newformdata.dqljzsj = newformdata.dqljzsj ? convertISODateTimeToYYYYMMDDHHMMSS(newformdata.dqljzsj) : ""
    setDjs(newformdata.djs)
    //如果供应商保密竞价，则隐藏排名列
    if (newformdata.gysbmjj_bj == '是') {
      setwlmxcolums(use_bqxj_jjh_initcolmun().filter((item) => item.dataIndex != "pm"))
      setbjcolums(use_bj_initcolmun().filter((item) => item.dataIndex != "blpm"))
      //更新明细表
      setswitche(false)
    }
    else {
      setwlmxcolums(use_bqxj_jjh_initcolmun())
      setbjcolums(use_bj_initcolmun())
      setswitche(false)
    }
    setformdata({ ...newformdata })
    if (!initStatusRef.current) {
      setBjlc(newformdata.dqlc)
    }
    setInitStatus(true)
    //过滤淘汰物料
    setwlmxdata(addkey_for_mxdata(rtdata.resultdata.wlmxdata.filter((item) => item.SubTableCount != 1)))
    setbjmxdata(addkey_for_mxdata(rtdata.resultdata.bjmxdata.map((item) => {
      item.bjsj = item.bjsj ? convertISODateTimeToYYYYMMDDHHMMSS(item.bjsj) : ""
      return item
    })))
  }

  // 页面进入加载数据
  useEffect(() => {
    loadformdata(JSON.parse(storage.pre_gysbqxj_item).data.id)
    setisloading(false)
    let a = setInterval(() => {
      query_ifjjzz()
    }, 3000)
    return () => {
      clearInterval(a)
    }
  }, [])
  // 每分钟查询一次项目是否已竞价结束
  const query_ifjjzz = async () => {
    let rtdata = await fetchsync_util("/admin/zbzx/query_ifjjzz", 'POST', { id: JSON.parse(storage.pre_gysbqxj_item).data.id }, "json")
    // console.log(rtdata.resultdata.rtdata[0].xmzt, formdataRef.current.xmzt);
    if (rtdata.resultdata.rtdata[0].xmzt == "竞价结束" && formdataRef.current.xmzt == "竞价中") {
      openNotification_util("该项目已竞价结束")
      await loadformdata(JSON.parse(storage.pre_gysbqxj_item).data.id)
      setDjs(0)
    }
    else if (rtdata.resultdata.rtdata.some((item) => item.sftt == "是" && item.gysmc == storage.ygxm)) {
      openNotification_util("抱歉，您的报价无法满足本次招标要求，感谢您的参与，期待下次与贵公司的合作！")
      setnowroute({ route: '/shipSRM/mainpage', title: '首页', closeroute: '/shipSRM/zbzx/gysjb_form' })
      setDjs(0)
    }
    else {
      // console.log(11111);
      await loadformdata(JSON.parse(storage.pre_gysbqxj_item).data.id)
    }
  }

  // 获取数字的小数位数
  const getDecimalPlaces = (num) => {
    if (Math.floor(num) === num) return 0;
    const str = num.toString();
    if (str.indexOf('.') !== -1 && str.indexOf('e-') === -1) {
      return str.split('.')[1].length;
    } else if (str.indexOf('e-') !== -1) {
      const parts = str.split('e-');
      return parseInt(parts[1], 10);
    }
    return 0;
  }

  //处理报价
  const handleBj = async (wldata) => {
    if (formdata.jjzt != '竞价中') {
      openNotification_util("当前状态不能报价")
      return
    }
    if (bjmxdata.some((item) => item.bjlc == formdata.dqlc && item.bjwlmxid == wldata.id)) {
      openNotification_util("当前轮次该物料已报价")
      return
    }
    if (bjjg <= 0) {
      openNotification_util("请输入正确的报价金额")
      return
    }
    //只有竞价形式才进行报价校验
    if (formdata.zbxs == '竞价') {
      if (formdata.jjgz_bj == "价高优先") {
        let filterdata = bjmxdata.filter((item, index) => item.bjwlmxid == wldata.id && item.bjlc != bjlc).sort((a, b) => b.blbj - a.blbj)
        
        //走百分比模式
        if (wldata.blje.includes("%")) {
          let mxblje = wldata.blje.replace("%", "") * 1
          let decimalPlaces = getDecimalPlaces(mxblje)
          
          // 计算两个约束条件的最小值
          let minRequiredPrice = Math.max(
            filterdata.length > 0 ? filterdata[0].blbj + filterdata[0].blbj * mxblje * 0.01 : 0,
            wldata.qsj + wldata.qsj * mxblje * 0.01
          )
          
          // 按照mxblje的小数位数精度处理
          minRequiredPrice = Math.round(minRequiredPrice * Math.pow(10, decimalPlaces)) / Math.pow(10, decimalPlaces)
          
          if (bjjg < minRequiredPrice) {
            let constraintMsg = ""
            if (filterdata.length > 0) {
              constraintMsg = `必须高于当前最高报价(${filterdata[0].blbj})加上差价比例(${wldata.blje})，即必须大于${filterdata[0].blbj + filterdata[0].blbj * mxblje * 0.01}`
            }
            constraintMsg += constraintMsg ? "；同时" : ""
            constraintMsg += `必须高于起始价(${wldata.qsj})加上差价比例(${wldata.blje})，即必须大于${wldata.qsj + wldata.qsj * mxblje * 0.01}`
            openNotification_util(`您的报价(${bjjg})${constraintMsg}`)
            return
          } else {
            console.log("当前报价满足所有约束条件，报价合法，可以报价");
          }
        }
        //走金额模式
        else {
          let mxblje = wldata.blje * 1
          let decimalPlaces = getDecimalPlaces(mxblje)
          
          // 计算两个约束条件的最小值
          let minRequiredPrice = Math.max(
            filterdata.length > 0 ? filterdata[0].blbj + mxblje : 0,
            wldata.qsj + mxblje
          )
          
          // 按照mxblje的小数位数精度处理
          minRequiredPrice = Math.round(minRequiredPrice * Math.pow(10, decimalPlaces)) / Math.pow(10, decimalPlaces)
          
          if (bjjg < minRequiredPrice) {
            let constraintMsg = ""
            if (filterdata.length > 0) {
              constraintMsg = `必须高于当前最高报价(${filterdata[0].blbj})加上差价金额(${mxblje})，即必须大于${filterdata[0].blbj + mxblje}`
            }
            constraintMsg += constraintMsg ? "；同时" : ""
            constraintMsg += `必须高于起始价(${wldata.qsj})加上差价金额(${mxblje})，即必须大于${wldata.qsj + mxblje}`
            openNotification_util(`您的报价(${bjjg})${constraintMsg}`)
            return
          } else {
            console.log("当前报价满足所有约束条件，报价合法，可以报价");
          }
        }
      }

      else if (formdata.jjgz_bj == "价低优先") {
        let filterdata = bjmxdata.filter((item, index) => item.bjwlmxid == wldata.id && item.bjlc != bjlc).sort((a, b) => a.blbj - b.blbj)
        
        //走百分比模式
        if (wldata.blje.includes("%")) {
          let mxblje = wldata.blje.replace("%", "") * 1
          let decimalPlaces = getDecimalPlaces(mxblje)
          
          // 计算两个约束条件的最大值
          let maxRequiredPrice = Math.min(
            filterdata.length > 0 ? filterdata[0].blbj - filterdata[0].blbj * mxblje * 0.01 : Infinity,
            wldata.qsj - wldata.qsj * mxblje * 0.01
          )
          
          // 按照mxblje的小数位数精度处理
          maxRequiredPrice = Math.round(maxRequiredPrice * Math.pow(10, decimalPlaces)) / Math.pow(10, decimalPlaces)
          
          if (bjjg > maxRequiredPrice) {
            let constraintMsg = ""
            if (filterdata.length > 0) {
              constraintMsg = `必须低于当前最低报价(${filterdata[0].blbj})减去差价比例(${wldata.blje})，即必须小于${filterdata[0].blbj - filterdata[0].blbj * mxblje * 0.01}`
            }
            constraintMsg += constraintMsg ? "；同时" : ""
            constraintMsg += `必须低于起始价(${wldata.qsj})减去差价比例(${wldata.blje})，即必须小于${wldata.qsj - wldata.qsj * mxblje * 0.01}`
            openNotification_util(`您的报价(${bjjg})${constraintMsg}`)
            return
          } else {
            console.log("当前报价满足所有约束条件，报价合法，可以报价");
          }
        }
        //走金额模式
        else {
          let mxblje = wldata.blje * 1
          let decimalPlaces = getDecimalPlaces(mxblje)
          
          // 计算两个约束条件的最大值
          let maxRequiredPrice = Math.min(
            filterdata.length > 0 ? filterdata[0].blbj - mxblje : Infinity,
            wldata.qsj - mxblje
          )
          
          // 按照mxblje的小数位数精度处理
          maxRequiredPrice = Math.round(maxRequiredPrice * Math.pow(10, decimalPlaces)) / Math.pow(10, decimalPlaces)
          
          if (bjjg > maxRequiredPrice) {
            let constraintMsg = ""
            if (filterdata.length > 0) {
              constraintMsg = `必须低于当前最低报价(${filterdata[0].blbj})减去差价金额(${mxblje})，即必须小于${filterdata[0].blbj - mxblje}`
            }
            constraintMsg += constraintMsg ? "；同时" : ""
            constraintMsg += `必须低于起始价(${wldata.qsj})减去差价金额(${mxblje})，即必须小于${wldata.qsj - mxblje}`
            openNotification_util(`您的报价(${bjjg})${constraintMsg}`)
            return
          } else {
            console.log("当前报价满足所有约束条件，报价合法，可以报价");
          }
        }
      }
    }
    await fetchsync_util("/admin/zbzx/save_gysjb_bj", 'POST', {
      id: JSON.parse(storage.pre_gysbqxj_item).data.id, bjjg, bjfj, sl: wldata.sl,
      dqlc: formdata.dqlc, wlmc: wldata.wlmc, ggxh: wldata.ggxh, wlbm: wldata.wlbm, bjwlmxid: wldata.id, jjgz_bj: formdata.jjgz_bj
    }, "json")
    await loadformdata(JSON.parse(storage.pre_gysbqxj_item).data.id)
    setModalOpen(false)
    setBjjg(0)
    setBjfj("")
  }



  // ... existing code ...
  const initchartdrcctj = async () => {

    let bjmxdata = bjmxdataRef.current
    let wldata = wldataRef.current

    var chartDom = document.getElementById('chart_bjqs');
    var myChart = echarts.init(chartDom);

    // 筛选当前物料的报价数据并按轮次排序
    let filterData = bjmxdata
      .filter(item => item.bjwlmxid === wldata?.id)
      .sort((a, b) => a.bjlc - b.bjlc);

    // 准备X轴和Y轴数据
    let xData = filterData.map(item => `第${item.bjlc}轮`);
    let yData = filterData.map(item => item.blbj);

    var option = {
      title: {
        text: '报价趋势图',
        left: 'center',
        textStyle: {
          color: '#333',
          fontSize: 14
        }
      },
      tooltip: {
        trigger: 'axis',
        formatter: '{b}: {c}元'
      },
      xAxis: {
        type: 'category',
        data: xData,
        axisLabel: {
          color: '#666'
        }
      },
      yAxis: {
        type: 'value',
        name: '报价金额(元)',
        nameTextStyle: {
          color: '#666'
        },
        axisLabel: {
          color: '#666',
          formatter: '{value}'
        }
      },
      series: [{
        data: yData,
        type: 'line',
        smooth: true,
        symbol: 'circle',
        symbolSize: 8,
        itemStyle: {
          color: '#a91f24'
        },
        lineStyle: {
          color: '#a91f24',
          width: 2
        },
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [{
              offset: 0,
              color: 'rgba(169,31,36,0.3)'
            }, {
              offset: 1,
              color: 'rgba(169,31,36,0.1)'
            }]
          }
        }
      }],
      grid: {
        left: '10%',
        right: '5%',
        bottom: '15%',
        top: '15%'
      }
    };

    option && myChart.setOption(option);

  };
  // ... existing code ...


  // 处理倒计时结束
  const handleDjsEnd = async () => {
    await loadformdata(JSON.parse(storage.pre_gysbqxj_item).data.id)
    setBjlc(formdataRef.current.dqlc)
  }

  const Title_item = (props) => {
    return (
      <div
        style={{
          height: "3vh", position: "relative", width: "100%", textIndent: "0.5rem", color: "#666666", lineHeight: "3vh",
          fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid", borderWidth: "0.3rem", borderColor: "#a91f24",
          marginBottom: "0.5vh", letterSpacing: "0.05rem"
        }}>
        {props.title}
      </div>
    )
  }

  const Title_item_content = (props) => {
    return (
      <div style={{
        fontSize: "1rem", fontWeight: "500", color: "#a91f24", marginLeft: "1vw", position: "relative", width: "100%",
        height: "4vh", lineHeight: "4vh"
      }}>
        <div style={{ color: "#858585", position: "absolute", left: "0", width: "40%" }}>{props.title}：</div>
        <div style={{ color: "black", position: "absolute", right: "0", width: "60%", ...props.styles }}>
          {props.content}
        </div>
      </div>
    )
  }

  return (

    <div style={{
      height: "94%", backgroundColor: `#F1F1F1`, right: "1%", top: "5.9vh", overflow: "auto",
      backgroundSize: "100% 100%", width: collapsed ? "94%" : "84%", position: "absolute", color: "white", fontSize: "0.8rem"
    }}>
      <Modal title="报价"
        width="35%"
        bodyStyle={{ height: "70vh", backgroundColor: "", position: "relative", width: "100%" }}
        open={modalOpen} onOk={() => { handleBj(wldata) }} onCancel={() => { setModalOpen(false) }}>



        <div style={{ width: "70%", height: "50%", backgroundColor: "", position: "absolute", left: "3%", top: "3%" }}>

          <div style={{
            borderLeftStyle: "solid", borderColor: "#a91f24", borderWidth: "0.3rem",
            paddingLeft: "0.5rem", fontSize: "0.7rem", fontWeight: "600", color: "#a91f24", marginBottom: "0.7vh"
          }}>
            填写本轮报价</div>

          <div style={{ display: "flex" }}>
            <div style={{ width: "30%", marginBottom: "1vh" }}>物料名称：</div>
            <div style={{ width: "70%", marginBottom: "1vh" }}>
              <div style={{ width: "100%" }}  >{wldata?.wlmc}</div>
            </div>
          </div>
          <div style={{ display: "flex" }}>
            <div style={{ width: "30%", marginBottom: "1vh" }}>规格型号：</div>
            <div style={{ width: "70%", marginBottom: "1vh" }}>
              <div style={{ width: "100%" }}  >{wldata?.ggxh}</div>
            </div>
          </div>
          <div style={{ display: "flex" }}>
            <div style={{ width: "30%", marginBottom: "1vh" }}>需求数量：</div>
            <div style={{ width: "70%", marginBottom: "1vh" }}>
              <div style={{ width: "100%" }}  >{wldata?.sl}</div>
            </div>
          </div>
          <div style={{ display: "flex" }}>
            <div style={{ width: "30%", marginBottom: "1vh" }}>起始价(单价)：</div>
            <div style={{ width: "70%", marginBottom: "1vh" }}>
              <div style={{ width: "100%" }}  >{wldata?.qsj}</div>
            </div>
          </div>
          <div style={{ display: "flex" }}>
            <div style={{ width: "30%", marginBottom: "1vh" }}>报价金额：</div>
            <div style={{ width: "70%", marginBottom: "1vh" }}>
              <InputNumber style={{ width: "80%" }} controls={false} value={bjjg} onChange={(value) => { setBjjg(value) }} />
            </div>
          </div>
          <div style={{ display: "flex", marginBottom: "1vh" }}>
            <div style={{ width: "30%" }}>附件：</div>
            <div style={{ width: "70%" }}>
              <Upload_fj_hooks initpxtpurl={bjfj} handleback={(value) => { setBjfj(value) }} />
            </div>
          </div>
        </div>


        <div style={{ width: "25%", height: "100%", backgroundColor: "", position: "absolute", right: "1%", top: "3%" }}>
          <div style={{
            borderLeftStyle: "solid", borderColor: "#a91f24", borderWidth: "0.3rem",
            paddingLeft: "0.5rem", fontSize: "0.7rem", fontWeight: "600", color: "#a91f24", marginBottom: "0.7vh"
          }}>
            历史报价记录</div>
          <Timeline>
            {bjmxdata.filter((item) => {


              if (wldata) {
                return item.bjwlmxid == wldata.id
              }
              else {
                return true
              }
            }).map((item) => (
              <Timeline.Item key={item.id}>{item.bjlc}轮报价：{item.blbj}</Timeline.Item>
            ))}
          </Timeline>

        </div>

        <div style={{
          width: "70%", height: "45%", backgroundColor: "", position: "absolute",
          left: "2%", bottom: "1%"
        }}>

          <div id="chart_bjqs"
            style={{
              width: "24vw", height: "27vh", backgroundColor: "", borderRadius: "0.2rem",

            }}>
          </div>



        </div>







      </Modal>
      <div style={styles.kshcontainer}>
        <div style={{ width: "100%", height: "100%", backgroundColor: "#f1f3f4", display: "flex", flexWrap: "wrap" }}>
          {/* 左边部分 */}
          <div style={{ width: "30%", height: "39vh", marginBottom: "6vh" }}>
            {/* 竞价倒计时 */}
            {<Title_item title="轮次信息" />}
            <div className={formdata.jjzt == '竞价中' ? 'fly_border' : ""}
              style={{
                width: "100%", height: "100%", borderRadius: "10px", backgroundColor: "white", marginBottom: "1vh", marginTop: "1vh", textAlign: "center", position: 'relative',
                boxShadow: formdata.jjzt == '竞价中' ?
                  "0 0 10px #25bf2f" : formdata.jjzt == '竞价休息' ? "0 0 10px #1890FF" :
                    "0 0 10px #ff1010",
              }}>

              <div style={{ fontSize: "1vw", fontWeight: "400", color: "#b6b6b6", marginTop: "1.3vh", position: "relative" }}>
                <div style={{ position: "relative", marginTop: "1.3vh", }}>
                  共设置 <span style={{ color: "#000000", fontWeight: "600", fontSize: "1.3vw", }}>{formdata?.jjls_bj}</span> 轮竞价
                  &nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;
                  当前进行 <span style={{ color: "#a91f24", fontWeight: "600", fontSize: "1.3vw" }}>{formdata?.dqlc}</span> 轮
                </div>
                <div style={{ position: "relative" }}>
                  <span style={{ fontWeight: "400", fontSize: "1vw", }}>每轮持续</span> <span style={{ color: "#a91f24", fontWeight: "600", fontSize: "1.3vw" }}>{formdata?.mlcx_bj}</span>分钟
                  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;
                  <span style={{ fontWeight: "400", fontSize: "1vw", }}>每轮间隔</span> <span style={{ color: "#000000", fontWeight: "600", fontSize: "1.3vw" }}>{formdata?.mljg_bj}</span>分钟
                </div>
              </div>
              <div style={{ fontSize: "1.2vw", fontWeight: "600", color: "#a91f24", marginTop: "3vh" }}>
                <CountdownFlipCard initialSeconds={djs} onEnd={() => { handleDjsEnd() }} />
              </div>
              <div style={{ fontSize: "1vw", fontWeight: "400", marginTop: "2vh", position: "relative", color: "#b6b6b6", left: "1rem", }}>
                <div style={{ display: "flex", alignItems: "center", marginBottom: "10px" }}>
                  <span>项目名称</span>
                  <span style={{ color: "#000000", fontWeight: "400", marginLeft: "0.5vw" }}>{formdata?.xmmc}</span>
                </div>

                <div style={{ display: "flex", alignItems: "center", justifyContent: "flex-start", width: "100%" }}>
                  <span>当前状态</span>
                  <span style={{
                    marginLeft: "20px", color:
                      formdata.jjzt == '竞价中' ? "#25bf2f" :
                        formdata.jjzt == '竞价休息' ? "#1890FF" :
                          "#ff1010", fontWeight: "400"
                  }}>●</span>
                  <span style={{ marginLeft: "10px" }}>{formdata.jjzt}</span>
                  <span style={{ marginLeft: "30px" }}>竞价规则</span>
                  <span style={{ marginLeft: "20px", color: "#000000", fontWeight: "400" }}>{formdata?.jjgz_bj}</span>
                </div>
              </div>
              {/* <div style={{ fontSize: "1.2vw", fontWeight: "600", color: "#ff1010", marginTop: "3vh" }}>
                <span style={{ marginRight: "0.5vw" }}>当前论次:</span><span style={{ color: "#ff1010" }}>{formdata?.dqlc}</span>
              </div> */}
              {/* <div style={{ fontSize: "1.2vw", fontWeight: "400", marginTop: "5vh", position: "relative" }}>
                <div style={{ position: "absolute", left: "0", width: "50%" }}>
                  <span style={{}}>每轮持续</span> <span style={{ color: "#428fe6", fontWeight:"600",marginLeft: "0.5vw" }}>{formdata?.mlcx}分钟</span>
                </div>
                <div style={{ position: "absolute", right: "0", width: "50%" }}>
                  <span style={{}}>每轮间隔</span> <span style={{ color: "#428fe6", fontWeight:"600",marginLeft: "0.5vw" }}>{formdata?.mljg}分钟</span>
                </div>
              </div> */}
            </div>

            {/* <Title_item title="项目状态" /> */}

            {/* <div
              className={formdata.jjzt == '竞价中' ? 'fly_border' : ""}
              style={{
                width: "100%", height: "calc(100% - 43vh)",
                borderRadius: "10px", boxShadow: formdata.jjzt == '竞价中' ?
                  "0 0 10px #25bf2f" : formdata.jjzt == '竞价休息' ? "0 0 10px #1890FF" :
                    "0 0 10px #ff1010",
                backgroundColor: "white",
                marginBottom: "1vh", position: 'relative'
              }}>
              <i class="top"></i><i class="bottom"></i>

              <div style={{
                fontSize: "1.2vw", fontWeight: "600", color:
                  formdata.jjzt == '竞价中' ? "#25bf2f" :
                    formdata.jjzt == '竞价休息' ? "#1890FF" :
                      "#ff1010",
                marginTop: "1vh", position: 'relative', width: '100%', textAlign: "center"
              }}>
                {formdata.jjzt==="竞价中"?<Badge size="big" status="success" text="竞价中" />:formdata.jjzt==="竞价休息"?<Badge size="big" status="processing" text="竞价休息" />:formdata.jjzt==="竞价结束"?<Badge size="big" status="error" text="竞价结束" />:null}
              </div>
              <div style={{ fontSize: "1vw", fontWeight: "600", marginLeft: "1vw", marginTop: "4vh", position: 'relative', width: '100%' }}>
                相关信息
              </div>
              <Title_item_content title="项目名称" content={formdata?.xmmc} />
              <Title_item_content title="竞价状态" content={formdata?.jjzt} styles={{ color: "#ffd44a" }} />
              {<Title_item_content title="竞价方式" content={formdata?.jzfs} />}
              <Title_item_content title="当前轮开始时间" content={formdata?.dqlkssj} />
              <Title_item_content title="当前轮结束时间" content={formdata?.dqljzsj} />
              {<Title_item_content title="当前竞价包" content={formdata?.dqlc} />}
              <Title_item_content title="总轮次" content={formdata?.jjls} />
              <Title_item_content title="当前轮次" content={formdata?.dqlc} />
              <Title_item_content title="竞价规则" content={formdata?.jjgz_bj} />
              <Title_item_content title="竞价比例或金额" content={formdata?.blJe} />
            </div> */}
          </div>
          {/* 右边部分 */}
          <div style={{ width: "67%", height: "40vh", marginLeft: "3%" }}>
            {/* 竞价行信息 */}
            {<Title_item title="竞价行信息" />}
            <div style={{ width: "100%", height: "40vh", position: 'relative', borderRadius: "10px", backgroundColor: "white", marginBottom: "1vh", padding: "1vh 0" }}>
              <Custom_table_hooks_config
                tabledata={wlmxdata} tablecolnum={wlmxcolums}
                width={"100%"}
                czWidth="60px"
                showCz
                noSearch
                renderCz={(data) => {
                  return <div style={{ display: "flex", justifyContent: "center", alignItems: "center" }}>
                    {/* <Popconfirm title="确定要报价吗？" disabled={formdata.jjzt != "竞价中"} onConfirm={() => {
                      if(data.SubTableCount==1){
                        openNotification_util("该物料已被淘汰，请报价其他物料")
                        return
                      }
                      setModalOpen(true);
                      setWldata(data);
                      setTimeout(() => {
                        initchartdrcctj();
                      }, 1000);
                    }}> */}
                    <Button disabled={formdata.jjzt != "竞价中"}
                      onClick={() => {
                        if (data.SubTableCount == 1) {
                          openNotification_util("该物料已被淘汰，请报价其他物料")
                          return
                        }
                        setModalOpen(true);
                        setWldata(data);
                        setTimeout(() => {
                          initchartdrcctj();
                        }, 1000);
                      }}
                      style={{
                        fontSize: '0.6rem', backgroundColor: "#f0fdfd",
                        fontWeight: "600", color: "#090c94"
                      }} size="small" >报价</Button>
                    {/* </Popconfirm> */}
                  </div>
                }}
                sfdoubleclick="false" ifhiddencchangeselecttype="true"
                // selectedRows={selectedRows} selectedRowKeys={selectedRowKeys}
                defaultPageSize={10}
                bordered
              // handleselectson={(selectedRows, selectedRowKeys) => {
              //   setselectedRows(selectedRows)
              //   setselectedRowKeys(selectedRowKeys)
              // }}
              />
              {/* <div style={{ width: "100%", position: "absolute", bottom: "1vh", left: "1vw" }}>
                <Button type="primary" onClick={() => { setModalOpen(true) }} disabled={formdata.jjzt != "竞价中"}>报价</Button>
              </div> */}
            </div>

          </div>
          {/* 报价明细 */}
          <Title_item title="报价明细" />
          <div style={{ width: "100%", height: "calc(100% - 50vh)", position: 'relative', borderRadius: "10px", backgroundColor: "white", marginBottom: "1vh", padding: "1vh 0" }}>
            {formdata.jjls_bj > 0 && (
              <Tabs activeKey={bjlc?.toString()} onChange={(key) => { setBjlc(key) }} className='task-tabs' >
                {Array.from({ length: formdata.jjls_bj }, (_, i) => (
                  <Tabs.TabPane tab={<span>第{i + 1}轮报价</span>} key={i + 1}>
                    <Custom_table_hooks_config
                      tabledata={addkey_for_mxdata(bjmxdata.filter((item) => item.bjlc === i + 1))}
                      tablecolnum={bjcolums}
                      width={"100%"}
                      sfdoubleclick="false"
                      ifhiddencchangeselecttype="true"
                      defaultPageSize={10}
                      bordered
                    />
                  </Tabs.TabPane>
                ))}
              </Tabs>
            )}
          </div>
        </div>

      </div>
    </div>
  )
}


export default Gysbqxj_form
var styles = {
  kshcontainer: {
    width: "98%", position: "absolute", top: "2%", left: "1%", backgroundColor: "white", color: "black", height: "98%",
    borderRadius: "10px"
  },
}